/**
 * 空状态组件
 * 当没有文档时显示引导信息
 */

import React from 'react'
import { Empty, Button, Space } from 'antd'
import { PlusOutlined, FileTextOutlined } from '@ant-design/icons'

export interface EmptyStateProps {
  onCreateNew: () => void
  onCreateFromTemplate?: () => void
  templateEnabled?: boolean
}

export const EmptyState: React.FC<EmptyStateProps> = ({ 
  onCreateNew, 
  onCreateFromTemplate,
  templateEnabled = false
}) => {
  return (
    <div style={{ textAlign: 'center', padding: '60px 20px' }}>
      <Empty
        image={Empty.PRESENTED_IMAGE_SIMPLE}
        description={
          <div>
            <p style={{ fontSize: 16, marginBottom: 8 }}>还没有任何文档</p>
            <p style={{ fontSize: 14, color: '#8c8c8c' }}>开始创建你的第一篇文档吧</p>
          </div>
        }
      >
        <Space>
          <Button
            type="primary"
            size="large"
            icon={<PlusOutlined />}
            onClick={onCreateNew}
          >
            创建空白文档
          </Button>
          {templateEnabled && onCreateFromTemplate && (
            <Button
              size="large"
              icon={<FileTextOutlined />}
              onClick={onCreateFromTemplate}
            >
              从模板创建
            </Button>
          )}
        </Space>
      </Empty>
    </div>
  )
}
